<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
      <#assign base=request.contextPath  />
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title></title>
    <link rel="stylesheet" href="${base}/frame/layui/css/layui.css">
    <link rel="stylesheet" href="${base}/frame/static/css/style.css">
    <link rel="icon" href="${base}/frame/static/image/code.png">
    <style type="text/css">
    </style>
    <style>
        .layui-table-cell{
            height: auto;
            line-height: ;
        }
    </style>
</head>
<body class="body">
<!-- 工具集 -->

<div class="my-btn-box">
            <span style="height: 50px;">

				
                <div class="layui-input-inline">
                	<label class="layui-form-label">车辆品牌</label>
                    <input type="text" autocomplete="off" id="carBrand" placeholder="品牌" class="layui-input"  style="width: 150px;height: 31px;margin-top: 4px;">
                </div>
                <button class="layui-btn  layui-btn-sm layui-btn-normal" id="seche22">查询</button>
            </span>
</div>
<!-- table -->
<table class="layui-hide" id="test" lay-filter="test"></table>
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="edit">续租</a>
</script>
<script src="${base}/js/jquery.min.js"></script>
<script   src="${base}/frame/layui/layui.all.js"></script>
<script type="text/javascript" src="${base}/js/index.js"></script>
<script type="text/javascript">

    // layui方法
    layui.use(['laydate','tree', 'table', 'vip_table', 'layer'], function () {

        // 操作对象
        var laydate = layui.laydate
                , table = layui.table
                , vipTable = layui.vip_table
                , layer = layui.layer
                , $ = layui.jquery;

        // 表格渲染
        var tableIns = table.render({
            even: true,//开启隔行背景
            url: '${base}/car/selectCar',
            title: '用户数据表',
            elem: '#test',
            toolbar: '#toolbarDemo',//指定原始表格元素选择器（推荐id选择器）
            cols: [[                  //标题栏
                {field: 'urla', title: '车辆照片',width:120,templet: function (val) {
                        var urla=val.urla;
                        return '<div><img src="${base}/car/getPhoto?path='+urla+'"></div>'
                    }
                }
                ,{field: 'ptName', title: '所属公司',width:90,align: 'center'}
                ,{field: 'carName', title: '车辆名',width:80,align: 'center'}
                , {field: 'carType', title: '车辆型号',width:90,align: 'center'}
                , {field: 'number', title: '数量',width:90,align: 'center'}
                , {field: 'carSize',title: '载重',align: 'center'}
                , {field: 'carKm', title: '续航',align: 'center'}
                , {field: 'base', title: '轴距',align: 'center'}
                ,{field: 'createTime', title: '创建时间',width:90,align: 'center',templet: function(d){return timeFormat(d.createTime)}}
                // , {field: 'createTime', title: '充电方式',align: 'center'}
                , {field: 'insure', title: '有无保险', templet:function(val){
                        var insure=val.insure;
                        if(insure==2){
                            return "无保险"
                        }else{
                            return"有保险"
                        }
                    }}
                ,{field: 'caozuo', title: '操作',align:'center',width:150,toolbar:'#barDemo'}
            ]]
            , id: 'dataCheck'
            , method: 'get'
            ,height:480
            ,page: {
                layout: ['limit', 'count', 'prev', 'page', 'next', 'skip']
                ,theme: '#9AC747'
                ,limit: 10
            }

        });

        table.on('tool(test)', function(obj){
            var data = obj.data;
            var aaa=data.carId;
            //layer.alert("aaa="+aaa);
            //console.log(obj)
            if(obj.event === 'edit'){
                layer.tab({
                    area: ['360px', '200px'],
                    offset: ['100px', '250px'],
                    tab: [{
                        title: '续租',
                        content:'<br><div class="layui-form">\n' +
                                '  <div class="layui-form-item">\n' +
                                '    <div class="layui-inline">\n' +
                                '      <label class="layui-form-label">续租到期时间</label>\n' +
                                '      <div class="layui-input-inline">\n' +
                                '        <input type="text" class="layui-input" id="test30" placeholder="yyyy-MM-dd">\n' +
                                '      </div>\n' +
                                '    </div>\n' +
                                '  </div>\n' +
                                '</div>'+
                                '<button style="float: right;margin-right:10px" class="layui-btn layui-btn-normal" lay-submit lay-filter="formDemo" type="button" onclick="onSubmit('+"'"+aaa+"'"+')">提交</button>\n'
                    }]

                });
            }
            //自定义颜色
            laydate.render({
                elem: '#test30'
                ,theme: '#393D49'
            });


            // var ww = JSON.stringify(data.carId);
            //  alert("ww:"+ww);


        });
        function timeFormat(nS) {
            return new Date(parseInt(("/Date("+nS+")/").substr(6, 13))).toLocaleDateString();
        };

    });
    //键盘事件
    $("body").bind("keydown",function(e){
        // 兼容FF和IE和Opera
        var theEvent = e || window.event;
        var code=theEvent.keyCode || theEvent.which || theEvent.charCode;
        if (code==13) {
            //回车执行查询
            $("#seche22").click();
        }
    });
    $('#seche22').on('click',function () {
        var carBrand=$("#carBrand").val();

        //表刷新方法
        var table = layui.table;
        table.reload(
                'dataCheck',{url:'${base}/car/searchcardetail',
                    where:{carBrand:carBrand} //设定异步数据接口的额外参数
                });

    })
    function Reservable(id){

        $.ajax({
            type:"POST",
            url:"${base}/car/update3",
            data:{"id":id},
            async:false,
            success:function(data){

                var table = layui.table;
                //表刷新方法
                table.reload('dataCheck', {
                    url: '${base}/car/selectCar'
                    ,where: {}, //设定异步数据接口的额外参数
                    //height: 300
                });

            }
        });
    }

    function Reservable2(id){

        $.ajax({
            type:"POST",
            url:"${base}/car/update4",
            data:{"id":id},
            async:false,
            success:function(data){

                var table = layui.table;
                //表刷新方法
                table.reload('dataCheck', {
                    url: '${base}/car/selectCar'
                     ,where: {}, //设定异步数据接口的额外参数
                    //height: 300
                });

            }
        });
    }


    //续租
    function onSubmit(aaa) {
        //var ww = JSON.stringify(data.carId);
        //获取userid
        //layer.alert("aaa="+aaa)

        var userid='${user.id}';
        //layer.alert("userid:"+userid);
        jsonDate = {};
        jsonDate.newEndTime = $("#test30").val();
        $.ajax({
            type:"post",
            url:"${base}/xuzu/insertXuZu",
            data:{"param":JSON.stringify(jsonDate),"userid":userid,"carId":aaa},
            success:function (data) {
                var table = layui.table;
                var layer=layui.layer;
                layer.alert("newEndTime:"+$("#test30").val())
                //清空表格
                jsonDate.newEndTime = $("#test30").val("");
                //表刷新方法

                table.reload('testReload', {
                    url: '${base}/car/selectCar'
                    ,where: {} //设定异步数据接口的额外参数

                });layer.closeAll();
            }

        });
    }

</script>
</body>
</html>